<template>
  <div class="">
    <div data-fetch-key="0" class="container">
      <main class="main--">
        <div class="main--breadcrumb">
          <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
              <li class="breadcrumb-item">
                <a href="/" target="_self">首页</a>
              </li>
              <li class="breadcrumb-item active">
                <span aria-current="location">产品展示</span>
              </li>
              <li class="breadcrumb-item active">
                <span aria-current="location">Opera 80 稳定版</span>
              </li>
            </ol>
          </nav>
        </div>
        <div class="card main--rich__text">
          <div class="card-body">
            <h1>{{ detailData.name }}</h1>
            <p class="detail--pic">
              <img
                :src="ip + src"
                alt="Opera 80 稳定版"
                class="rich--img__wide"
              />
            </p>
            <p v-html="detailData.content"></p>
          </div>
        </div>
      </main>
    </div>
  </div>
</template>

<script>
import { getDetail } from "../../network/api.js";
import { ip } from "../../network/ip.js";

export default {
  data() {
    return {
      detailData: {},
      ip: ip,
      src: "",
    };
  },
  mounted() {
    let ip = this.$route.params.ip;
    getDetail(ip).then((res) => {
      if (res.data) {
      }
      this.detailData = res.data;
      this.src = res.data.pic.split("public/")[1];
    });
    this.fn();
  },
  methods: {
    fn() {
      let str = "";
      str.substring(2);
    },
  },
  components: {},
};
</script>

<style lang="scss" scoped></style>
